<template>
  <div class="main1">
    <a-col span="13">
      <a-form-model
        ref="showData"
        :model="showData"
        :label-col="{ span: 8 }"
        :wrapper-col="{ span: 12 }"
        :rules="rules"
        class="user-layout-register"
      >
        <a-form-model-item
          label="所属协会"
          prop="society_id"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-select v-model="showData.society_id" @change="societySelect">
            <template v-for="(item, index) in societySelection">
              <a-select-option :key="index" :value="item.society_id">
                {{ item.society_name }}
              </a-select-option>
            </template>
          </a-select>
        </a-form-model-item>
        <a-form-model-item
          label="危大工程分类"
          prop="classic_name"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-select v-model="showData.classic_name">
            <template v-for="(itemtype, index1) in societyDangerous">
              <a-select-option :key="index1" :value="itemtype.classic_name">
                {{ itemtype.classic_name }}
              </a-select-option>
            </template>
          </a-select>
        </a-form-model-item>
        <!-- <a-form-model-item label="论证编号" prop="argument_num" :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }">
          <a-input v-model="showData.argument_num"></a-input>
        </a-form-model-item> -->
        <a-form-model-item
          label="联系人"
          prop="people_name"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-input v-model="showData.people_name"></a-input>
        </a-form-model-item>
        <a-form-model-item
          label="联系电话"
          prop="phone"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-input v-model="showData.phone"></a-input>
        </a-form-model-item>
        <a-form-model-item
          label="工程名称"
          prop="project_name"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-input v-model="showData.project_name"></a-input>
        </a-form-model-item>
        <a-form-model-item
          label="建设单位"
          prop="construction_unit"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-input v-model="showData.construction_unit"></a-input>
        </a-form-model-item>
        <a-form-model-item
          label="监理公司"
          prop="supervision_unit"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-input v-model="showData.supervision_unit"></a-input>
        </a-form-model-item>
        <a-form-model-item
          label="承建单位"
          prop="bulid_unit"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-input v-model="showData.bulid_unit"></a-input>
        </a-form-model-item>
        <a-form-model-item
          label="工程地址"
          prop="project_site"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-input v-model="showData.project_site"></a-input>
        </a-form-model-item>
        <a-form-model-item
          label="委托日期"
          prop="entrust_time"
          :style="{ display: 'inline-block', width: 'calc(50% - 12px)' }"
        >
          <a-date-picker
            placeholder="选择日期"
            v-model="showData.entrust_time"
            :format="dateFormat"
          />
          <!-- :default-value="moment( new Date(), dateFormat)" -->
        </a-form-model-item>
        <a-form-model-item :wrapper-col="{ span: 12, offset: 20 }">
          <a-button-group>
            <a-button
              @click="
                () => {
                  this.$router.push('/login')
                }
              "
            >
              返回登陆页
            </a-button>
            <a-button type="primary" @click="onSubmit" :loading="loading"> 提交信息 </a-button>
            <a-modal
              title=""
              :visible="visible"
              :confirm-loading="confirmLoading"
              @ok="handleOk"
            >
              <p>账号：{{ passaccount }}</p>
              <p>密码：{{ password }}</p>
            </a-modal>
          </a-button-group>
        </a-form-model-item>
      </a-form-model>
    </a-col>
  </div>
</template>

<script>
import md5 from 'md5'
import moment from 'moment'
import { getProjectCreatecc, getSocietyCreate, getSocietySelection, getSocietyDangerous } from '@/api/login'
export default {
  name: 'Project',
  components: {},
  data () {
    return {
      password: {},
      passaccount: {},
      visible: false,
      confirmLoading: false,
      loading: false,
      dateFormat: 'YYYY/MM/DD',
      pass: [],
      disvisible: true,
      NumberDisplay: false,
      societySelection: [],
      societyDangerous: [],
      previewVisible: false, // 图片预览模态框可见
      previewImage: '', // 图片预览Src
      showData: { business_license_file: [], qualification_certificate_file: [], classic_name: '' },
      rules: {
        society_id: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        classic_name: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        argument_num: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        people_name: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        phone: [{ required: true, message: '内容不可为空', trigger: 'blur' },
               { min: 11, max: 11, message: '长度在 11 个字符且为数字' }],
        project_name: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        construction_unit: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        supervision_unit: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        bulid_unit: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        project_site: [{ required: true, message: '内容不可为空', trigger: 'blur' }],
        entrust_time: [{ required: true, message: '内容不可为空' }]
      }
    }
  },
  computed: {},
  methods: {
    moment,
    AcquireSociety () {
      getSocietySelection().then(res => {
        this.societySelection = res.result
        var time = {}
        Object.assign(time, { 'entrust_time': res.result.create_time })
        this.showData = JSON.parse(JSON.stringify(time))
        console.log(this.showData)
      })
    },
    societySelect (value) {
      // eslint-disable-next-line camelcase
      var society_id = `${value}`
      console.log(society_id)
      // localStorage.setItem('society_id', society_id)
      var sid = new FormData()
      sid.append('society_id', society_id)
      getSocietyDangerous(sid).then((res) => {
        this.societyDangerous = res.result
        console.log(this.societyDangerous)
      })
    },
    handleCancel () {
      this.previewVisible = false
      this.previewImage = ''
    },
    onSubmit () {
      this.$refs.showData.validate((valid) => {
        if (valid) {
          this.loading = true
          console.log(this.showData)
          var status = '0'
          var showData = {}
          showData = {
            'society_id': this.showData.society_id,
            'argument_classic': this.showData.classic_name,
            'people_name': this.showData.people_name,
            'phone': this.showData.phone,
            'project_name': this.showData.project_name,
            'construction_unit': this.showData.construction_unit,
            'supervision_unit': this.showData.supervision_unit,
            'bulid_unit': this.showData.bulid_unit,
            'project_site': this.showData.project_site,
            'entrust_time': new Date(this.showData.entrust_time).getTime() / 1000,
            'status': status
          }
          console.log(showData)
          getSocietyCreate(showData)
            .then((res) => {
              this.pass = res.result
              // var accounth = this.pass.society_id
              // var accountb = this.pass.itemship_number
              // if (accounth < 10) {
              //   accounth = '0' + accounth
              // }
              // if (accountb < 10) {
              //   accountb = '0' + accountb
              //   if (accountb < 100) {
              //     accountb = '0' + accountb
              //   }
              // }
              // if (accountb < 100) {
              //     accountb = '0' + accountb
              //   }
              this.passaccount = this.pass.phone
              this.password = this.pass.phone
              console.log(res)
              if (res.code === 200) {
                this.$notification.success({
                  title: '成功',
                  message: '提交注册成功'
                })
                this.loading = false
                this.visible = true
              } else {
                this.loading = false
                this.$notification.error({
                  message: '失败',
                  description: res.message
                })
              }
            })
            .catch((err) => {
              this.$notification.error({
                title: err.code,
                message: err.message
              })
              this.loading = false
            })
        }
      })
    },
    handleOk (e) {
      this.confirmLoading = true
      var Createcc = {}
      Createcc = {
            'society_id': this.pass.society_id,
            'itemship_id': this.pass.itemship_id,
            'account': this.passaccount,
            'temporary_password': md5(this.password)
          }
      getProjectCreatecc(Createcc).then((res) => {
      })
      setTimeout(() => {
        this.visible = false
        this.confirmLoading = false
        this.$router.push('register-result')
      })
    }
  },
  watch: {},
  mounted () {
    this.AcquireSociety()
  }
}
</script>
<style lang="less" scoped>
.main1 {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}
.user-layout-register {
  .login {
    float: right;
    line-height: 40px;
  }
}
</style>
